{% extends  'base.html' %}
        
{% block content %}
	
	<h1>{{uidp.name}}</h1>

	<div>
		<div class="tabs selected" id="show_image_form">Image</div>
		<div class="tabs" id="show_implementation_form">Implementation</div>
	</div>	
	<div class="clearfloat"></div>
	
	<form action="" method="post" id="image_example_form" class='form'>
		<p>Insira abaixo as informações sobre o novo screenshot.</p>
		<input type="hidden" name="type" id="type" value="image" />
		<table>
			{{ image_form.as_table }}
		</table>
		<script>
			$("#id_name").attr("value", "{{ example.name }}");
			$("#id_link").attr("value", "{{ example.link }}");
			$("#id_description").attr("value", "{{ example.description }}");
			$("#id_target_version").attr("value", "{{ uidp.target_version }}");
		</script>
		
		{% ifequal action "edit" %}
			<input type="button" value="Editar" class="button" id="edit_image_example_button"/>
		{% else %}
			<input type="button" value="Adicionar" class="button" id="new_image_example_button"/>
		{% endifequal %}
		<a href="/collections/{{collection.id}}/uidps/{{uidp.id}}" ><input type="button" value="Cancelar" class="button" id="cancel_button"/></a>
		
	</form>

	<form action="" method="post" id="implementation_example_form" class='form'>
		<p>Insira abaixo as informações sobre o novo exemplo de implementação.</p>
		<input type="hidden" name="type" id="type" value="implementation" />
		<table>
			{{ implementation_form.as_table }}
		</table>
		<script>
			$("#id_name").attr("value", "{{ example.name }}");
			$("#id_link").attr("value", "{{ example.link }}");
			$("#id_description").attr("value", "{{ example.description }}");
			$("#id_target_version").attr("value", "{{ uidp.target_version }}");
		</script>
		
		{% ifequal action "edit" %}
			<input type="button" value="Editar" class="button" id="edit_example_button"/>
		{% else %}
			<input type="button" value="Adicionar" class="button" id="new_implementation_example_button"/>
		{% endifequal %}
		<a href="/collections/{{collection.id}}/uidps/{{uidp.id}}" ><input type="button" value="Cancelar" class="button" id="cancel_button"/></a>
		
	</form>
	<script>
		$('#image_example_form').show();
		$('#implementation_example_form').hide();
	</script>


{% endblock %}